<template>
    <div class="l-from-body" >
        <el-form :model="formData" :rules="rules" size="mini"  ref="form" label-width="60px" >
            <el-row :gutter="0">
                <div class="l-rblock">
                    <el-col :span="12" v-if="lr_hasPageAuth('f_Account')">
                        <el-form-item label="账号" prop="f_Account" >
                            <el-input v-model="formData.f_Account" :readonly="readonlyAccount" ></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="12" v-if="lr_hasPageAuth('f_RealName')">
                        <el-form-item label="姓名" prop="f_RealName">
                            <el-input v-model="formData.f_RealName"></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="12" v-if="lr_hasPageAuth('f_Password')">
                        <el-form-item label="密码" prop="f_Password">
                            <el-input v-model="formData.f_Password" :type="passwordType" :readonly="readonlyPassword" >
                                <i class="el-icon-view el-input__icon"
                                slot="suffix"
                                @click="showPassword"></i>
                            </el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="12" v-if="lr_hasPageAuth('f_Gender')">
                        <el-form-item label="性别" prop="f_Gender">
                            <l-radio  v-model="formData.f_Gender" :options="optionsGender" ></l-radio>
                        </el-form-item>
                    </el-col>
                   
                    <el-col :span="24" v-if="lr_hasPageAuth('f_EnabledMark')">
                        <el-form-item label="状态" prop="f_EnabledMark" >
                            <el-switch
                                :active-value="1"
                                :inactive-value="0"
                                v-model="formData.f_EnabledMark"
                                >
                            </el-switch>
                        </el-form-item>
                    </el-col>
                    <el-col :span="24" v-if="lr_hasPageAuth('f_Description')">
                        <el-form-item label="描述" prop="f_Description">
                            <el-input type="textarea" v-model="formData.f_Description"></el-input>
                        </el-form-item>
                    </el-col>     
                </div>
            </el-row>
        </el-form>        
    </div>
</template>
<script>
export default {
    data(){
        return {
            passwordType: "password",

            readonlyAccount:false,
            readonlyPassword:false,
            optionsGender:[{label:'男',value:1},{label:'女',value:0}],
            formData:{
                f_Account:'',
                f_Password:'',
                f_RealName:'',
                f_Gender:1,
                f_EnabledMark:1,
                f_Description:''
            },
            rules: {
                f_Account: [
                    { required: true, message: '请输入账号' },
                    { validator: this.lr_existDbFiled,keyValue:() => { return this.formData.f_UserId },tableName:'lr_base_user',keyName:'f_UserId',trigger: 'null'}
                ],
                f_RealName: [
                    { required: true, message: '请输入姓名' }
                ],
                f_Password: [
                    { required: true, message: '请输入密码' }
                ]
            }
            
        };
    },
    created () {
    },
    methods:{
        resetForm(){
            this.passwordType = "password"
            this.readonlyPassword = false
            this.readonlyAccount = false
            this.formData.f_UserId = ''
            this.$formClear(this.$refs.form)
        },
        // 校验表单
        validateForm(){
            return this.$formValidateWraper(this.$refs.form)
        },
        setForm(data){
            data = this.$deepClone(data)
            this.readonlyPassword = true;
            this.readonlyAccount = true;
            this.formData = data.user
            this.formData.f_Password = 'xxxxxx'
        },
        getForm(){
            const postData = {
                user:this.$deepClone(this.formData)
            }
            return postData
        },




        showPassword() {
            if(this.readonlyPassword){
                return
            }
            this.passwordType == ""
                ? (this.passwordType = "password")
                : (this.passwordType = "")
        },


    }
}
</script>